<template>
  <div>
    <!--活动车辆列表-->

    <FilterTable
      :isExportExcel="false"
      exportFileName="活动数据.xlsx"
      :onCalcExportData="handleExportFun"
      ref="table" :columns="columns" :fetchapi="fetchApi" :params="fetchParams" datakey="records"
      :isSelectColumn="false" :onColumnsChange="columns => (this.columns = columns)">

      <template slot="controls" >
        <multiuse-button type="primary"  :click="exportHandle.bind(this)">导出</multiuse-button>
      </template>
    </FilterTable>

    <div class="dialogBottmView">
      <el-button size="small" type="primary" class="btnStyle" @click="closeDialog">关闭
      </el-button>
    </div>

  </div>
</template>

<script>
  import {mapState} from 'vuex';
  import {dictionary} from '@/utils/dictMixin';
  import moment from 'moment';
  import {isEmpty} from '@/utils/utils';
  import {getAllUser} from '@/api/repair/batchEventManagement/activityDistribution';
  import {showTtRpMaVin,exportShowTtRpMaVin} from '@/api/repair/batchEventManagement/activityQueryCDuan';
  import {arrayObjDeWeight} from '@/utils';
  import {dealerMixin} from '@/pages/repair/batchEventManagement/dealerMixin';

  export default {
    name: 'sportCar',
    mixins: [dictionary,dealerMixin],
    data()
    {
      this.BaseTable = null;
      return {
        fetchApi: showTtRpMaVin,
        dialogTitle: '',
        fetchParams: {xhrAbort: false, 'flag': this.flag, 'maId': this.maId},
        columns: this.createTableColumns(),
      };
    },
    props: ['flag', 'maId'],
    components: {},

    mounted()
    {
      this.BaseTable = this.$refs.table.$refs.pageTable;

      this.getAllDelears(this.columns, ['ownerCode'], 'table')
    },
    methods: {
      // 导出处理函数
      handleExportFun(row)
      {
      },
      async exportHandle()
      {
        await this.downHandleFile( exportShowTtRpMaVin,this.fetchParams,'活动数据')
      },

      async initSelect()
      {
        let res = await getAllUser();
        // 去重
        let dataList = arrayObjDeWeight(res.data, 'userId');

        this.columns.find(item => item.dataIndex === 'maBy').dictItems = dataList.map(x => ({
          text: x.employeeName,
          value: x.userId
        }));
      },

      createTableColumns()
      {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            sorter: true,
            render: props =>
            {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '活动编号',
            dataIndex: 'maNo',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },

          {
            title: 'VIN',
            dataIndex: 'vin',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '车型名称',
            dataIndex: 'modelName',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
          },
          {
            title: '维修工单号',
            dataIndex: 'roNo',
            sorter: true,
            filter: true,
            filterType: 'input',
          },
          {
            title: '完成经销商代码',
            dataIndex: 'resDealer',
            sorter: true,
            filter: true,
            filterType: 'input',
            render: props =>
            {
              return <span>{props.row.ownerCode}</span>;
            }

          },
          {
            title: '完成经销商名称',
            dataIndex: 'ownerCode',
            width: 150,
            sorter: true,
            filter: true,
            dictItems: [],
            filterItems: [],
            filterType: 'checkbox'

          },
          {
            title: '完成时间',
            dataIndex: 'cancelDate',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'date-range'
          },
        ];
      },

      closeDialog()
      {
        this.$emit('closeCar', 'close')
      }
    }
  };
</script>

<style scoped lang="less">
  .bg1 {
    border: 1px solid @borderColor;
    border-radius: @borderRadius;
    box-shadow: @boxShadow;
    padding: @modulePadding;
    padding-left: 0;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .bg2 {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .btn {
    text-align: center;
  }

  .btnStyle {
    margin-top: 10px;
  }
</style>

